{__NOLAYOUT__}
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="/agent/school/common.css"/>
    <link rel="stylesheet" type="text/css" href="/agent/school/add.css"/>
    <script type="text/javascript" src="/agent/manage/js/jquery.1.9.1.js" ></script>
    <script type="text/javascript" src="/agent/manage/js/rem.js" ></script>
    <script type="text/javascript" src="/agent/school/layer.js" ></script>
    <link rel="stylesheet" type="text/css" href="/agent/school/css/layer.css"/>
    <link rel="stylesheet" type="text/css" href="/agent/serial/css/mobileSelect.css">
    <script src="/agent/serial/js/mobileSelect.js" type="text/javascript"></script>
    <title>学校管理</title>
</head>
<body>
<form id="form2" action="/agent/school/add"  method="post">
    <ul class="order_money" style="padding: 0 0.3rem;background: #fff;">
        <li>
            <span class="num leadname">学校名称</span>
            <span class="bitian">必填</span>
            <input type="text" class="nameAdd" name="row[name]" id="week" value="" />
        </li>
        <li>
            <span class="time">学校类别</span>
            <div id="trigger2" class="trigger4" style="display: inline-block;width: 100%;margin-top: 0.1rem;">
                <span class="jt" style="margin-top: 0.13rem;"></span>
                <span class="bitian">必填</span>
            </div>
            <input type="hidden" name="row[type]" id="type" value="" />
        </li>
        <li>
            <span class="time">学校类型</span>
            <div id="trigger3" class="trigger4" style="display: inline-block;width: 100%;margin-top: 0.1rem;">
                <span class="jt" style="margin-top: 0.13rem;"></span>
                <span class="bitian">必填</span>
            </div>
            <input type="hidden" name="row[category]" id="type2" value="" />
        </li>
        <li>
            <span class="time">所在地区</span>
            <div id="trigger4" class="trigger4" style="display: inline-block;width: 100%;margin-top: 0.1rem;">
                <span class="jt" style="margin-top: 0.13rem;"></span>
                <span class="bitian">必填</span>
            </div>
            <input type="hidden" name="row[province]" id="province" value="" />
            <input type="hidden" name="row[city]" id="city" value="" />
            <input type="hidden" name="row[area]" id="area" value="" />
        </li>
        <li style="overflow: hidden;">
            <span class="address leadname">详细地址</span>
            <textarea id="address" class="nameAdd" name="row[address]" placeholder="如：道路、门牌号等"></textarea>
        </li>
    </ul>
    <ul class="product">
        <li>学校领导<div class="jia"><img src="/agent/school/img/jia.png"/></div></li>
    </ul>
    <ul class="productinfo">

        <!--<li>
            <a href="leader_info.html">
                <div class="inforight">
                    <p>校长</p>
                    <p class="infop2">职务：校长</p>
                </div>
                <div class="right">
                    13211221211<img src="img/tel.png"/>
                </div>
            </a>
        </li>-->
    </ul>
    <div class="button">
        <input class="submit" type="submit" name="" id="" value="保存" />
    </div>
</form>

<div id="form3" >
        <ul class="order_money" style="padding: 0 0.3rem;background: #fff;">
            <li>
                <span class="leadname">姓名</span>
                <input type="text" class="nameAdd" name="name" id="leadname" value="" />
                <span class="bitian">必填</span>
            </li>
            <li>
                <span class="sex">性别</span>
                <span class="jt"></span>
                <div id="trigger5" class="trigger5" style="display: inline-block;width: 96%;margin-top: 0.1rem;">
                    <span class="bitian5">必填</span>
                </div>
                <input type="hidden" name="sex" id="sex" value="" />
                <input type="hidden" name="sex_text" id="sex_text" value="" />
            </li>
            <li>
                <span class="job">职务</span><span class="jt"></span>
                <div id="trigger6" class="trigger6" style="display: inline-block;width: 96%;margin-top: 0.1rem;">
                    <span class="bitian6">必填</span>
                </div>
                <input type="hidden" name="job" id="job" value="" />
                <input type="hidden" name="job_text" id="job_text" value="" />
            </li>
            <li>
                <span class="money leadname">手机号</span>
                <input type="number" class="nameAdd" name="money" id="money" value="" placeholder="请输入手机号" />
            </li>
            <li style="height: 2.3rem;">
                <p class="title leadname">其他：</p>
                <textarea class="bei nameAdd" id="bei" name="bei" style="height: 1.3rem;" ></textarea>
            </li>
        </ul>
        <div class="button">
            <p class="preserve">保存</p>
        </div>
</div>
<div id="form4">
    <ul class="order_money" style="padding: 0 0.3rem;background: #fff;">
        <li>
            <span class="leadname">姓名</span>
            <input type="text" class="nameAdd" name="" id="leadname_edit" value="" />
            <span class="bitian">必填</span>
        </li>
        <li>
            <span class="sex">性别</span><span class="jt"></span>
            <div id="trigger7" class="trigger7" style="display: inline-block;width: 96%;margin-top: 0.1rem;">
                <span class="bitian7">必填</span>
            </div>
            <input type="hidden" name="" id="sex_edit" value="" />
            <input type="hidden" name="" id="sex_text_edit" value="" />
        </li>
        <li>
            <span class="job">职务</span><span class="jt"></span>
            <div id="trigger8" class="trigger8" style="display: inline-block;width: 96%;margin-top: 0.1rem;">
                <span class="bitian8">必填</span>
            </div>
            <input type="hidden" name="" id="job_edit" value="" />
            <input type="hidden" name="" id="job_text_edit" value="" />
        </li>
        <li>
            <span class="money">手机号</span>
            <input type="number" name="" id="money_edit" value="" placeholder="请输入手机号" />
        </li>
        <li style="height: 2.3rem;">
            <p class="title">其他</p>
            <textarea class="bei_edit" id="bei_edit" style="height: 1.3rem;" ></textarea>
        </li>
    </ul>
    <div class="button">
        <div class="close">删除</div>
        <div class="continue"><p class="preserve_edit">保存</p></div>
    </div>
</div>
<script>
  var index = 1;
  var myHeight = $(window).height();
  $('#form3').css('height',myHeight+'px');
  $('#form4').css('height',myHeight+'px');
  $('.product').click(function(){
    $('#form3').show();
    $('#leadname').val('');
    $('#job').val('');
    $('#money').val('');
  });
  $('.preserve').click(function(){
    var name = $('#leadname').val();
    var sex = $('#sex').val();
    var sex_text = $('#sex_text').val();
    var job = $('#job').val();
    var job_text = $('#job_text').val();
    var money = $('#money').val();
    var bei = $('#bei').val();
    //表单验证
    if(!formAuth(name,sex,job,money)){
      return false
    }
    var li = '';
    li += '<li id="edit_'+index+'" onclick="edit('+index+');">' +
      '<div class="inforight"><span class="input_name">'+name+'</span>\n' +
      '<input class="input_name_'+index+'" name="teacher['+index+'][name]" type="hidden" value="'+name+'" />' +
      '<input class="input_sex_'+index+'" name="teacher['+index+'][sexlist]" type="hidden" value="'+sex+'" />' +
      '<input class="input_sex_text_'+index+'"   type="hidden" value="'+sex_text+'" />' +
      '<p class="infop2">职务：<span class="input_job">'+job_text+'</span><input  class="input_job_text_'+index+'"  type="hidden" value="'+job_text+'" />' +
      '<input class="input_job_'+index+'" name="teacher['+index+'][role]" type="hidden" value="'+job+'" />' +
      '<input class="input_bei_'+index+'" name="teacher['+index+'][characteristic]" type="hidden" value="'+bei+'" /></p></div>' +
      '<div class="right"><img src="img/tel.png"/><span class="input_tel">'+money+'</span>' +
      '<input class="input_tel_'+index+'" name="teacher['+index+'][phone]" type="hidden" value="'+money+'" />' +
      '</div>' +
      '</li>';
    $('.productinfo').append(li);
    index++;
    $('#form3').hide();
    $('#leadname').val('');
    $('#sex').val('');
    $('#job').val('');
    $('#money').val('');
    $('#bei').val('');
  });

  //删除当前编辑的数据
  $('.close').click(function(){
    var index = $('#form4').attr('data-id');
    console.log(index);
    $('#edit_'+index).remove();
    $('#form4').attr('data-id','');
    $('#form4').hide();
  });

  //编辑保存
  $('.preserve_edit').click(function(){
    $('#form4').hide();
    //获取编辑表单的值
     var name = $('#leadname_edit').val();
     var sex = $('#sex_edit').val();
     var sex_text = $('#sex_text_edit').val();
     var job = $('#job_edit').val();
     var job_text = $('#job_text_edit').val();
     var money = $('#money_edit').val();
     var bei = $('#bei_edit').val();
    var index = $('#form4').attr('data-id');
    //表单验证
    if(!formAuth(name,sex,job,money)){
      return false
    }
    //改变隐藏域的值
    $('.input_name_'+index).val(name);
    $('.input_sex_'+index).val(sex);
    $('.input_sex_text_'+index).val(sex_text);
    $('.input_job_'+index).val(job);
    $('.input_job_text_'+index).val(job_text);
    $('.input_money_'+index).val(money);
    $('.input_bei_'+index).val(bei);
  });

  //编辑表单
  function edit(index){
    //获取表单索引
    $('#form4').show();
    $('#leadname_edit').val($('.input_name_'+index).val());
    $('#sex_edit').val($('.input_sex_'+index).val());
    $('#sex_text_edit').val($('.input_sex_text_'+index).val());
    $('.bitian7').text($('.input_sex_text_'+index).val());
    $('#job_edit').val($('.input_job_'+index).val());
    $('#job_text_edit').val($('.input_job_text_'+index).val());
    $('.bitian8').text($('.input_job_text_'+index).val());
    $('#money_edit').val($('.input_tel_'+index).val());
    $('#bei_edit').val($('.input_bei_'+index).val());
    $('#form4').attr('data-id',index);
    $('.bitian4').hide();
    $('.leadname').css('font-size','0.2rem');
  }
  //提交表单
$(function(){
  $('.submit').click(function(){
    var name = $('#week').val();//学校名称
    var schoolstyle = $('#type').val();//学校类别
    var type = $('#type2').val();//学校类型
    var province = $('#province').val();//所在地区
    var city = $('#city').val();//所在地区
    var area = $('#area').val();//所在地区
    var address = $('#address').val();//详细地址
    if(name == ''||name == null){
      layer.open({
        content:'请输入学校名称' ,
        skin: 'msg',
        time: 2 //2秒后自动关闭
      });
      return false
    }
    if(schoolstyle == ''||schoolstyle == null){
      layer.open({
        content:'请选择学校类别' ,
        skin: 'msg',
        time: 2 //2秒后自动关闭
      });
      return false
    }
    if(type == ''||type == null){
      layer.open({
        content:'请选择学校类型' ,
        skin: 'msg',
        time: 2 //2秒后自动关闭
      });
      return false
    }
    if(province == ''||province == null){
      layer.open({
        content:'请选择所在地区' ,
        skin: 'msg',
        time: 2 //2秒后自动关闭
      });
      return false
    }
    if(city == ''||city == null){
      layer.open({
        content:'请选择所在地区' ,
        skin: 'msg',
        time: 2 //2秒后自动关闭
      });
      return false
    }
    if(area == ''||area == null){
      layer.open({
        content:'请选择所在地区' ,
        skin: 'msg',
        time: 2 //2秒后自动关闭
      });
      return false
    }
    if(address == ''||address == null){
      layer.open({
        content:'请添加详细地址' ,
        skin: 'msg',
        time: 2 //2秒后自动关闭
      });
      return false
    }
    var data = $("form").serialize();
    $.ajax({
      type: 'post',
      url:"/agent/school/add" ,
      data:data,
      dataType: "json",
      success: function(data){
        if(data.code == 0)
        {
          layer.open({
            content:data.msg ,
            skin: 'msg',
            time: 2 //2秒后自动关闭
          });
          return false
        }
        layer.open({
          content:data.msg ,
          skin: 'msg',
          time: 2 //2秒后自动关闭
        });
        setTimeout(function(){
          window.location.href=data.url;
        }, 2000);
      }
    });
    return false;
  });
});

 var schooltype = [{id:'1',value:'小学'},{id:'2',value:'初中'},{id:'3',value:'高中'}];
 var schoolcategory = [{id:'A',value:'A'},{id:'B',value:'B'},{id:'C',value:'C'},{id:'D',value:'D'}];
  var mobileSelect2 = new MobileSelect({
    trigger: '#trigger2',
    title: '学校类别',
    wheels: [{data: schooltype}],
    transitionEnd:function(indexArr, data){},
    callback:function(indexArr, data){
      $('#type').val(data[0].id);
      $('.name').css('font-size','0.2rem');//学校类别
    }
  });
    var mobileSelect3 = new MobileSelect({
      trigger: '#trigger3',
      title: '学校类型',
      wheels: [{data: schoolcategory}],
      transitionEnd:function(indexArr, data){},
      callback:function(indexArr, data){
        $('#type2').val(data[0].id);
        $('.fen').css('font-size','0.2rem');//学校类型
      }
    });
  //地区三级联动
var mobileSelect4 = new MobileSelect({
  trigger: '#trigger4',
  title: '地区选择',
  wheels: [{data:[{id:'1', value:'', childs:[{id:'A1',value:''},]}]}],
  transitionEnd:function(indexArr, data){},
  callback:function(indexArr, data){
    $('#province').val(data[0].id);
    $('#city').val(data[1].id);
    $('#area').val(data[2].id);
    $('.time').css('font-size','0.2rem');
  }
});
$.ajax({
  type: "post",
  url: "/api/ajax/area",
  dataType: "json",
  success: function(res){
    mobileSelect4.updateWheels(res.data);
  }
});
    var mobileSelect5 = new MobileSelect({
      trigger: '#trigger5',
      title: '性别选择',
      wheels: [{data:[{id:'1', value:'男'}, {id:'2', value:'女'}]}],
      transitionEnd:function(indexArr, data){},
      callback:function(indexArr, data){
        $('#sex').val(data[0].id);
        $('#sex_text').val(data[0].value);
        $('.sex').css('font-size','0.2rem');
      }
    });
    //1=校长,2=副校长,3=教导主任,4=学科备课组长,5=年级组长,6=班主任,7=任课教师,8=班长
    var mobileSelect6 = new MobileSelect({
      trigger: '#trigger6',
      title: '职务选择',
      wheels: [{data:[{id: '1', value: '校长'},{id: '2', value: '副校长' },{ id: '3',value: '教导主任'},{id: '4',value: '学科备课组长' },{id: '5', value: '年级组长'},{id: '6', value: '班主任'}, {id: '7', value: '任课教师'}, {id: '8', value: '班长'}]}],
      transitionEnd:function(indexArr, data){},
      callback:function(indexArr, data){
        $('#job').val(data[0].id);
        $('#job_text').val(data[0].value);
        $('.job').css('font-size','0.2rem');
      }
    });
  var mobileSelect7 = new MobileSelect({
    trigger: '#trigger7',
    title: '性别选择',
    wheels: [{data:[{id:'1', value:'男'}, {id:'2', value:'女'}]}],
    transitionEnd:function(indexArr, data){},
    callback:function(indexArr, data){
      $('#sex').val(data[0].id);
      $('.sex').css('font-size','0.2rem');
    }
  });
  //1=校长,2=副校长,3=教导主任,4=学科备课组长,5=年级组长,6=班主任,7=任课教师,8=班长
  var mobileSelect8 = new MobileSelect({
    trigger: '#trigger8',
    title: '职务选择',
    wheels: [{data:[{id: '1', value: '校长'},{id: '2', value: '副校长' },{ id: '3',value: '教导主任'},{id: '4',value: '学科备课组长' },{id: '5', value: '年级组长'},{id: '6', value: '班主任'}, {id: '7', value: '任课教师'}, {id: '8', value: '班长'}]}],
    transitionEnd:function(indexArr, data){},
    callback:function(indexArr, data){
      $('#job').val(data[0].id);
      $('.job').css('font-size','0.2rem');
    }
  });

  //字体变化
  $('.nameAdd').keyup(function(){
    if($(this).val() == '')
    {
      $(this).siblings('.bitian').show();
      $(this).siblings('.leadname').css('font-size','0.32rem');
    }else{
      $(this).siblings('.bitian').hide();
      $(this).siblings('.leadname').css('font-size','0.2rem');
    }
  });

  function formAuth(name,sex,job,money) {
    if(name == ''||name == null){
      layer.open({content:'请输入姓名' , skin: 'msg', time: 2 });
      return false
    }
    if(sex == ''||sex == null){
      layer.open({content:'请选择性别' , skin: 'msg', time: 2 });
      return false
    }
    if(job == ''||job == null){
      layer.open({content:'请选择职务' , skin: 'msg', time: 2 });
      return false
    }
    if (money.length == 0) {
      layer.open({content:'请输入手机号' , skin: 'msg', time: 2 });
      return false
    }
    if (isPhoneNo(money) == false) {
      layer.open({content:'请输入正确的手机号' , skin: 'msg', time: 2 });
      return false
    }
    return true;
  }

  // 验证手机号
  function isPhoneNo(phone) {
    var pattern = /^1[3456789]\d{9}$/;
    return pattern.test(phone);
  }
</script>
</body>
</html>
